<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
                template="./layout/mainTemplate.xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:p="http://primefaces.org/ui"  
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns="http://www.w3.org/1999/xhtml">

    <ui:define name="content">
        <p:messages id="messag" showDetail="true"  autoUpdate="true" closable="true" > 
            <p:effect type="fade" event="load" delay="#{gestorPrincipal.delayMessage}" />
        </p:messages>

        <h:form id="form">

            <h:panelGroup rendered="#{gestorGalerias.fotos.size() > 0}">
                <p:galleria value="#{gestorGalerias.fotos}" var="foto" panelWidth="540" panelHeight="400" showCaption="true">  
                    <p:graphicImage value="#{gestorGalerias.pathGaleria()}#{foto.link}" alt="#{foto.descripcion}" title="#{foto.descripcion}"/>  
                </p:galleria>
            </h:panelGroup>
            <p:panel header="Galería" rendered="#{gestorGalerias.fotos.size() == 0 and gestorGalerias.videos.size() == 0}">
                <p:outputLabel value="Aún no existen imágenes ni videos en esta galería"/>
            </p:panel>

            <br/><br/>

            <p:dataGrid var="video" value="#{gestorGalerias.videos}" columns="1"  rendered="#{gestorGalerias.videos.size() > 0}"
                        rows="12" paginator="true"  
                        paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"  
                        rowsPerPageTemplate="9,12,15">  

                <p:panel header="#{video.nombre}" style="text-align:center"> 
                    <h:panelGrid columns="1" style="width:100%">  

                        <p:media value="#{gestorGalerias.obtlink(video)}" width="420" height="315" player="flash"/>  

                        <h:outputText value="#{video.descripcion}" />  

                    </h:panelGrid>  
                </p:panel>  
            </p:dataGrid>              
        </h:form>
    </ui:define>
</ui:composition>